
<div class="x_panel">
  <div class="x_content" style="display: block;">
    <!--表格主体内容-->
    <div class="cont">
      <table class="table table-bordered table-striped">
        <thead>
        <tr>
          <th width="100px">ID</th>
          <th>商品分类</th>
          <th>图片</th>
          <th>排序</th>
          <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {foreach $category.lists as $categoryitem}
        <tr class="more">
          <td>{$categoryitem.category_id}</td>
          <td>{$categoryitem.category_name}</td>
          <td>{if $categoryitem.category_pic}<img src="{$categoryitem.category_pic}" width="50px" height="50px"/>{/if} </td>
          <td>{$categoryitem.category_sort}</td>
          <td>
            <div class="x_content">
              <button class="btn btn-success btn-xs sub" data="{$categoryitem.category_id}"> 展开小类</button>
              <button style="display: none" class="btn btn-success btn-xs nosub" data="{$categoryitem.category_id}"> 收起小类</button>
              <a class="btn btn-primary btn-xs" href="{eval U(['category/edit','category_id'=>$categoryitem.category_id])}"> 编辑</a>

            </div>
          </td>
        </tr>
        {/foreach}
        </tbody>
      </table>
      <!--分页-->

      {Yii::$app->view->render('/com/pager.php',['pager'=>$category['pager']])}
    </div>
  </div>
</div>

<script>
    $(".sub").click(function(){
        var category_id = $(this).attr("data");
        var url = "{['category/sub-index']|U}";
        var button = $(this);
        $.post(url, 'category_id='+category_id, function (data) {

            $.each(JSON.parse(data),function(key,value) {
                html = '<tr class="subcategory'+category_id+'">';
                html += '<td>'+value.category_id+'</td>';
                html += '<td>'+value.category_name+'</td>';
                if(value.category_pic){
                    html += '<td><img src="'+value.category_pic+'" width="50px" height="50px"/></td>';
                }else{
                    html += '<td></td>';
                }
                html += '<td>'+value.category_sort+'</td>';
                html += '<td><div class="x_content"><a class="btn btn-primary btn-xs" href="/category/edit.html?category_id='+value.category_id+'"> 编辑</a></div></td>'

                //console.log(button.parents(".more").attr("data"));
                button.parents(".more").after(html)
            });

        });
        button.hide();
        $('.nosub').show();
    });

    $(".nosub").click(function(){
        var category_id = $(this).attr("data");
        $(".subcategory"+category_id).remove();
        $(".sub").show();
        $('.nosub').hide();
    });
</script>